<template>
    <div class="friend-link-container">
        <div class="link-title">
            友情链接
        </div>

        <div class="link-list-box">
            <el-row :gutter="20">
                <el-col :span="4" v-for="(item, index) in friendLinks"
                        :key="index">
                    <div class="link-item">
                        <a :href="item.url" target="_blank">
                            <el-image class="link-item-img" :src="item.logo" fit="fit"></el-image>
                        </a>
                    </div>
                </el-col>
            </el-row>
        </div>

    </div>
</template>

<script>
import {getFriendLink} from "assets/api/web-size-info-portal-api";
import {success_code} from "assets/utils/LRConstant";

export default {
    name: "index",
    data() {
        return {
            friendLinks: [],
        }
    },
    methods: {
        initData() {
            getFriendLink().then((result) => {
                if (result.code === success_code) {
                    this.friendLinks = result.data;
                }
            })
        }
    },
    mounted() {
        this.$store.commit("setCurrentActivity", "/link");
        this.initData();
    }
}
</script>

<style scoped>
.link-item {
    margin-top: 10px;
    border: 1px solid pink;
}

.link-item-img {
    height: 74px;
}

.friend-link-container {
    background-color: white;
    margin: 20px 0;
    padding: 10px;
}

.link-title {
    text-align: center;
    font-size: 20px;
    color: rebeccapurple;
    font-weight: 600;
    margin: 10px 0;
}
</style>